<template>
  <el-card>
    <div slot="header">
      <h3>指导加价率变更通知-处理</h3>
    </div>
    <div>
      <skus-table
        ref="skusTable"
        :maxTableHeight="480"
        :dataSource="TableInfo.list"
        :columns="TableInfo.columns"
        :loading="TableInfo.loading"
      >
        <BtnRender slot="content_context" :render="renderBtnsBar" />
      </skus-table>
    </div>
  </el-card>
</template>
<script>
import SkusTable from '@/components/skusTable';
import BtnRender from '@/components/JSXRender/BtnRender';
import { TableInfo } from '@/utils/getUtils';
import { isResponseSuccess } from '@/utils/bizUtils';
import { getListPageBtnsBar } from '@/utils/getBtnsRender';
import { TABLE_COLUMNS } from './constants/view';
import {
  getProductMarkupRateTodoRecordDetailService,
  unProcessProductMarkupRateTodoRecordService
} from '@/api/finance/salePriceManage/markupRateChangeNotice';
export default {
  components: {
    SkusTable,
    BtnRender
  },
  data () {
    return {
      TableInfo: new TableInfo({ columns: TABLE_COLUMNS }),
      recordNo: '',
      btnLoading: {
        unprocess: false
      }
    }
  },
  mounted () {
    this.recordNo = this.$route?.query?.recordNo
    this.setDetailsByRecordNo()
  },
  methods: {
    // 渲染按钮操作栏
    renderBtnsBar (h) {
      const btnBars = [
        { label: '不做处理', method: this.handleUnprocess, loading: this.btnLoading.unprocess },
        { label: '去修改', method: this.handleToEdit },
        { label: '返回', type: 'default', method: this.handleGoBack }
      ]
      return getListPageBtnsBar(h, btnBars)
    },
    // 不做处理
    async handleUnprocess () {
      const data = { recordNo: this.recordNo }
      const loadingFn = state => { this.btnLoading.unprocess = state }
      const res = await unProcessProductMarkupRateTodoRecordService(data, loadingFn)
      if (isResponseSuccess(res)) {
        this.$message.success('操作成功')
        this.handleGoBack()
      }
    },
    // 去修改 - 带入数据到区域加价率编辑页面(根据单据号在编辑页面查询数据进行带入)
    handleToEdit () {
      this.$router.push({
        name: 'areaMarkupRateEdit',
        query: { todoRecordNo: this.recordNo }
      })
    },
    // 返回
    handleGoBack () {
      this.$router.push({ name: 'markupRateChangeNoticeList' })
    },
    // 设置单据页详情数据
    async setDetailsByRecordNo () {
      const data = { recordNo: this.recordNo }
      const res = await getProductMarkupRateTodoRecordDetailService(data, this.TableInfo.setLoading)
      if (res?.retData) {
        const {
          getProductMarkupRateTodoRecordsVo,
          productMarkupRateTodoRecordDetailVos
        } = res.retData
        this.TableInfo.setList(productMarkupRateTodoRecordDetailVos)
        this.fieldsData = getProductMarkupRateTodoRecordsVo
      }
    }
  }
}
</script>
